<template>
  <view
    style="
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      width: 90%;
      height: 100%;
    "
  >
    <wd-form ref="form" :model="model" style="width: 100%">
      <wd-cell-group border>
        <wd-input
          v-model="model.value1"
          style="width: 100%; margin: 30rpx 0%"
          label-width="100px"
          prop="value1"
          clearable
          placeholder="请输入手机号"
          :rules="[
            { required: true, message: '请填写手机号' },
            {
              pattern: /^1[3-9]\d{9}$/,
              message: '手机号格式错误',
              required: false,
            },
          ]"
        />
        <wd-input
          v-model="model.value2"
          style="width: 100%"
          label-width="100px"
          prop="value2"
          show-password
          clearable
          placeholder="请输入密码"
          :rules="[{ required: true, message: '请填写密码' }]"
        />
      </wd-cell-group>
    </wd-form>
    <view class="w-[100%]">
      <wd-checkbox v-model="LoginValue.okZC2" checked-color="#45d4bf" disabled @click="tzMzsm">
        我已同意
        <text color="#00c8ab">优医协议</text>
      </wd-checkbox>
    </view>
    <wd-button
      type="success"
      custom-class="custom-shadow"
      :disabled="LoginValue.okZC2 ? false : true"
      style="width: 100%"
      @click="handleSubmit"
    >
      登录
    </wd-button>
    <text color="#00cc99" @click="LoginValue.qhCart">免密登录</text>
  </view>
</template>

<script setup lang="ts">
import { useToast } from "wot-design-uni";
import { LoginPinia } from "@/store/modules/Login";
import { useUserStore } from "@/store/modules/user";

const LoginValue = LoginPinia();
const userStore = useUserStore();
const { success: showSuccess } = useToast();

function tzMzsm() {
  uni.navigateTo({ url: "/pages/Agreement/index?cac=1" });
}
const model = reactive<{
  value1: string;
  value2: string;
}>({
  value1: "",
  value2: "",
});

const form = ref();

function handleSubmit() {
  form.value
    .validate()
    .then(({ valid }) => {
      if (valid) {
        console.log(model.value1, model.value2);
        userStore.login({
          phone: model.value1,
          password: model.value2,
        });
        // if (!LoginValue.user || LoginValue.user.length === 0) {
        //   console.log("没有用户数据");
        //   return;
        // }
        // if (!model.value1 || !model.value2) {
        //   console.log("请输入账号和密码");
        //   return;
        // }
        // let isUserFound = false;
        // for (let i = 0; i < LoginValue.user.length; i++) {
        //   if (
        //     model.value1 === LoginValue.user[i].phone &&
        //     model.value2 === LoginValue.user[i].password
        //   ) {
        //     uni.switchTab({ url: "/pages/home/index" });
        //     console.log("登录成功");
        //     isUserFound = true;
        //     break;
        //   }
        // }
        // if (!isUserFound) {
        //   console.log("账号密码错误");
        // }
      }
    })
    .catch((error: any) => {
      console.log(error, "error");
    });
}
</script>

<style setup lang="scss"></style>
